<template>
    <div style="height: 100%; width: 100%; position: relative">
        <div class="pagetop">
            <div style="width: 100%">
                <div style="width: 50%; float: left">
                    <table style="font-size: 12px; width: 500px">
                        <tr>
                            <td align="center"><span style="font-size: 18px; font-weight: bolder">条码号</span></td>
                            <td>
                                <el-input v-model.trim="txtbarcode" placeholder="输入条码号" @keyup.enter.native="scanbarcode" ref="reftxtbarcode" clearable style="width: 260px" @focus="focusBarcode" size="medium"></el-input>
                            </td>
                            <td align="right">
                                <el-button icon="el-icon-document" @click="saveRecord" ref="refsave">保存</el-button>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
        <div class="pagecenter">
            <table style="width: 500px; font-size: 12px" class="table1style">
                <tr>
                    <td align="right">标本备注</td>
                    <td colspan="3">
                        <el-select v-model="obj.sample_detail" filterable clearable style="width: 100%" ref="refselect1" @keyup.enter.native="selectBlur(1)">
                            <el-option v-for="(item, index) in reportcommOption" :label="item.label" :value="item.label" :key="index" style="width: 600px"></el-option>
                        </el-select>
                    </td>
                </tr>
                <tr>
                    <td align="right">标本不合格</td>
                    <td colspan="3">
                        <el-select v-model="obj.reject_reason" filterable clearable ref="refselect2" style="width: 100%" @keyup.enter.native="selectBlur(2)">
                            <el-option v-for="(item, index) in RefuseReasonOption" :label="item.label" :value="item.label" :key="index"></el-option>
                        </el-select>
                    </td>
                </tr>
                <tr>
                    <td align="right">条码号</td>
                    <td>
                        <el-input v-model="obj.barcode" readonly="readonly"></el-input>
                    </td>
                    <td align="right">病人姓名</td>
                    <td>
                        <el-input v-model="obj.pat_name" class="myinputClass" readonly="readonly"></el-input>
                    </td>
                </tr>
                <tr>
                    <td align="right">病人号</td>
                    <td>
                        <el-input v-model="obj.pat_no" readonly="readonly"></el-input>
                    </td>
                    <td align="right">分单类别</td>
                    <td>
                        <el-input v-model="obj.req_groupna" readonly="readonly"></el-input>
                    </td>
                </tr>
                <tr>
                    <td align="right">运输链ID</td>
                    <td colspan="3">
                        <el-input type="text" v-model="obj.transportid" readonly="readonly"></el-input>
                    </td>
                </tr>
                <tr>
                    <td colspan="4">
                        <el-input type="textarea" class="mytextareaClass" v-model="obj.sample_items" readonly="readonly" :rows="6"></el-input>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</template>

<script type="text/javascript">
export default {
    name: "LIS231",
    data() {
        return {
            obj: {
                sample_detail: "",
                reject_reason: "",
            },
            RefuseReasonOption: [],
            reportcommOption: [],
            txtbarcode: "",
        };
    },
    created() {
        this.getoptions(); //初始化下拉框的数据
    },
    mounted() {
        if (this.$refs.reftxtbarcode) this.$refs.reftxtbarcode.focus();
    },
    updated() {},
    methods: {
        scanbarcode() {
            this.$tool
                .request({
                    url: "LIS/LIS2/LIS231",
                    method: "post",
                    data: {
                        action: "scanbarcode",
                        barcode: this.txtbarcode,
                    },
                })
                .then((res) => {
                    if (res.data.length > 0) {
                        this.obj = res.data[0];
                        this.$refs.refselect1.focus();
                    } else {
                        this.obj = {};
                        this.txtbarcode = "";
                        this.$refs.reftxtbarcode.focus();
                    }
                })
                .catch((e) => {
                    this.$message.error(e);
                });
        },
        getoptions() {
            this.$tool
                .request({
                    url: "LIS/LIS2/LIS231",
                    method: "post",
                    data: {
                        action: "getoptions",
                    },
                })
                .then((res) => {
                    this.RefuseReasonOption = res.RefuseReasonOption;
                    this.reportcommOption = res.reportcommOption;
                })
                .catch((e) => {
                    this.$message.error(e);
                });
        },
        saveRecord() {
            if (!this.obj.barcode) {
                this.$alert("请输入条码号！", "提示");
                this.$refs.reftxtbarcode.focus();
                return false;
            }
            this.$tool
                .request({
                    url: "LIS/LIS2/LIS231",
                    method: "post",
                    data: {
                        action: "saveRecord",
                        ...this.obj,
                    },
                })
                .then((res) => {
                    if (res.flag == "1") {
                        this.$pub.message(this, "保存成功！", "success");
                        this.txtbarcode = "";
                        this.$refs.reftxtbarcode.focus();
                    } else {
                        this.$alert(res.msg, "出错");
                    }
                })
                .catch((e) => {
                    this.$message.error(e);
                });
        },
        selectBlur(index) {
            if (index == "1") {
                this.obj.sample_detail = this.$refs.refselect1.selectedLabel;
                this.$refs.refselect1.blur();
                this.$refs.refselect2.focus();
            } else {
                this.obj.reject_reason = this.$refs.refselect2.selectedLabel;
                this.$refs.refselect2.blur();
                setTimeout(() => {
                    this.$refs.refsave.$el.focus();
                }, 10);
            }
        },
        focusBarcode() {
            this.$refs.reftxtbarcode.select();
        },
    },
};
</Script>

<style scoped>
.pagetop {
    width: 100%;
    height: 50px;
    display: -webkit-box;
    -webkit-box-pack: left;
    -webkit-box-align: center;
    border: 1px solid #ccc;
    position: absolute;
    z-index: 99;
}

.pagecenter {
    position: absolute;
    top: 55px;
    width: 100%;
    left: 0;
    bottom: 0px;
    overflow: auto;
    border: 1px solid #ccc;
}

.table1style tr td {
    padding: 4px 5px 5px 2px;
}
.myinputClass >>> .el-input__inner {
    color: blue !important;
    /*font-size: 18px !important;font-family: cursive !important;*/
}
.mytextareaClass >>> .el-textarea__inner {
    color: blue !important;
}
</style>